<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<link rel="stylesheet" type="text/css"
			href="extjs/resources/css/ext-all.css" rel="stylesheet" />
		<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
		<script type="text/javascript" src="extjs/ext-all-debug.js"></script>

		<title>欢迎使用在线填表系统</title>
		<Script Language="JavaScript"></Script>
	</head>
	<body>
		<script type="text/javascript">
	Ext.onReady(function() {

		//定义一个Panel  
			var Tree = Ext.tree;
			var tree = new Tree.TreePanel( {
				autoScroll : true,
				region : 'west',
				animate : true,
				enableDD : true,
				width : 160,
				rootVisible : false,
				containerScroll : true,
				loader : new Tree.TreeLoader( {
					dataUrl : 'http://localhost/resources/orgsource/tree',
					requestMethod : 'GET'
				})
			});

			var root = new Tree.AsyncTreeNode( {
				text : 'Ext JS',
				draggable : false,
				id : 'source',
				expanded : true
			});
			tree.on( {
				'click' : function(node, event) {
					Ext.Ajax.request( {
						url : 'http://localhost/resources/acounts/getbyorgid',
						method : 'GET',
						params : {
							orgid : node.id
						},
						success : function(response, options) {
							grid.store.loadData(Ext.util.JSON
									.decode(response.responseText));
						},
						scopse : this
					});
				}
			}, this);
			tree.setRootNode(root);
			var store = new Ext.data.JsonStore( {
				root : 'acounts',
				fields : [ {
					name : 'acount'
				}, {
					name : 'pwd'
				}, {
					name : 'owner'
				}, {
					name : 'email'
				}, {
					name : 'tel'
				}, {
					name : 'credate'
				}, {
					name : 'sta'
				}, {
					name : 'detail'
				} ]
			});
			var grid = new Ext.grid.GridPanel( {
				title : '账号列表',
				region : 'center', //放在西边，即左侧  
				plit : true,
				width : 200,
				height : 200,
				border : false,
				store : store,
				columns : [ {
					id : 'acount',
					header : '账户名',
					width : 100,
					sortable : true,
					dataIndex : 'acount'
				}, {
					header : '持有者',
					width : 100,
					sortable : true,
					dataIndex : 'owner'
				}, {
					header : '电话号码',
					width : 100,
					sortable : true,
					dataIndex : 'tel'
				}, {
					id : 'cdetail',
					dataIndex : 'detail',
					header : '备注'
				} ],
				bbar : [ {
					text : '添加',
					handler : function() {
						this.s = grid.getSelectionModel().getSelections();
						this.arr = new Array();
						for ( var i = 0, r; r = this.s[i]; i++) {
						var js = {
								acname : r.data.acount
								//acowner : r.data.owner,
								//acphone : r.data.tel,
								//acdetail : r.data.detail
							};
							this.arr[i] = js;
						}
						Ext.Ajax.request({
						url:'http://localhost/resources/deals/add',
						jsonData:this.arr,
						success:function(response,options){
							alert(response.responseText);
						},
						scope:this
						});						
						//alert(Ext.util.JSON.encode(this.arr));
						for ( var i = 0, r; r = this.s[i]; i++) {
							grid2.store.insert(0, r);
							grid2.getView().refresh();
						}
					},
					scope : this
				} ]
			});
			var store2 = new Ext.data.JsonStore(
					{
						root : 'acounts',
						autoLoad : true,
						url : 'http://localhost/resources/deals/getlink?taid=f7853bab2fb34b07012fb34b07340000',
						fields : [ {
							name : 'acount'
						}, {
							name : 'pwd'
						}, {
							name : 'owner'
						}, {
							name : 'email'
						}, {
							name : 'tel'
						}, {
							name : 'credate'
						}, {
							name : 'sta'
						}, {
							name : 'detail'
						} ]
					});
			var grid2 = new Ext.grid.GridPanel( {
				title : '安排填表账号',
				region : 'south', //放在西边，即左侧  
				plit : true,
				width : 200,
				height : 200,
				border : false,
				store : store2,
				columns : [ {
					id : 'acount',
					header : '账户名',
					width : 100,
					sortable : true,
					dataIndex : 'acount'
				}, {
					header : '持有者',
					width : 100,
					sortable : true,
					dataIndex : 'owner'
				}, {
					header : '电话号码',
					width : 100,
					sortable : true,
					dataIndex : 'tel'
				}, {
					id : 'cdetail',
					dataIndex : 'detail',
					header : '备注'
				} ],
				bbar:[
				{
					text:'删除所选',
					handler:function(){}
				}
				]
			});
			var nav3 = new Ext.Panel( {
				title : '安排填表账号',
				region : 'south', //放在西边，即左侧  
				split : true,
				width : 200,
				height : 200,
				border : false
			});
			var nav1 = new Ext.Panel( {
				region : 'center', //放在西边，即左侧  
				split : true,
				width : 200,
				layout : 'border',
				margins : '3 0 3 3',
				cmargins : '3 3 3 3',
				items : [ grid, grid2 ]
			});
			var win = null;
			//如果窗口第一次被打开时才创建  
			if (!win) {
				win = new Ext.Window( {
					title : '安排填表任务',
					closable : true,
					width : 600,
					height : 400,
					border : false,
					plain : true,
					layout : 'border',
					items : [ tree, nav1 ]
				//把上面创建的panel和TabPanel放在window中，并采用border方式布局  
						});
			}
			win.show();
		});
</script>
	</body>
</html>